<template>
  <el-menu
    :default-active="activeIndex2"
    class="el-menu-demo"
    mode="horizontal"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
  >
    <el-menu-item
      ><font style="font-family: PingFang SC; font-size: 19px; color: #909399"
        >欢迎来到Blog：<font style="color: white">{{
          nickname == null ? "" : nickname
        }}</font
        >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font
      ></el-menu-item
    >
    <el-menu-item index="1"
      ><i class="el-icon-s-home"></i
      ><a href="#/home"
        ><font style="font-size: 15px">首页&nbsp;&nbsp;&nbsp;&nbsp;</font></a
      ></el-menu-item
    >
    <el-menu-item index="2"
      ><i class="el-icon-position"></i
      ><a href="#/type" target="_self"
        ><font style="font-size: 15px">分类&nbsp;&nbsp;&nbsp;&nbsp;</font></a
      ></el-menu-item
    >
    <el-menu-item index="3"
      ><i class="el-icon-price-tag"></i
      ><a href="#/tag" target="_self"
        ><font style="font-size: 15px">标签&nbsp;&nbsp;&nbsp;&nbsp;</font></a
      ></el-menu-item
    >
    <el-menu-item index="4"
      ><i class="el-icon-edit"></i
      ><a href="#/blog" target="_self"
        ><font style="font-size: 15px"
          >发布博客&nbsp;&nbsp;&nbsp;&nbsp;</font
        ></a
      ></el-menu-item
    >
    <el-menu-item index="5"
      ><i class="el-icon-user"></i
      ><a href="#/userDetail?id=1" target="_self"
        ><font style="font-size: 15px">个人中心</font></a
      ></el-menu-item
    >
    <el-menu-item style="margin-left: 400px"
      ><el-input placeholder="请输入内容" v-model="keywords">
        <el-button
          slot="append"
          icon="el-icon-search"
          @click="searchData"
        ></el-button>
      </el-input>
    </el-menu-item>
    <el-menu-item style="float: right"
      ><el-link :underline="false" href="#/regist">注册</el-link></el-menu-item
    >
    <el-menu-item style="float: right"
      ><el-link :underline="false" href="#/login">登录</el-link></el-menu-item
    >
  </el-menu>
</template>

<script>
import bus from "@/eventBus.js";

export default {
  data() {
    return {
      activeIndex2: "1",
      keywords: "",
      nickname: JSON.parse(sessionStorage.getItem("user")).nickname,
    };
  },
  computed: {
    /*     nickname() {
      var user = JSON.parse(sessionStorage.getItem("user"));
      return nickname = user.nickname;
    }, */
  },
  created() {
    this.searchData();
  },
  methods: {
    searchData() {
      this.$get("/search?keywords=" + this.keywords).then((res) => {
        if ((res.code = 200)) {
          bus.$emit("share", res.data);
          this.keywords = "";
        }
      });
    },
  },
};
</script>

<style>
</style>